import React from 'react'
import { Menu } from 'antd'
import { UserOutlined, LaptopOutlined, NotificationOutlined } from '@ant-design/icons';
import data from './data'
import { NavLink } from 'react-router-dom'
const { SubMenu } = Menu;
type Props = {}




const Index = (props: Props) => {
	return (
		<div>
			<Menu
				mode="inline"
				defaultSelectedKeys={['1']}
				defaultOpenKeys={['sub1']}
				style={{ height: '100%', borderRight: 0 }}
			>
				{
					data.map(v => {
						return v.children
							? (
								<SubMenu key={v.key} title={v.title}>
									{
										v.children.map(v => {
											return <Menu.Item key={v.key}>
												<NavLink to={v.path}>{v.title}</NavLink>
											</Menu.Item>
										})
									}
								</SubMenu>
							)
							: (<Menu.Item key={v.key}>
								<NavLink to={v.path}>{v.title}</NavLink>
							</Menu.Item>)
					})
				}
			</Menu>
		</div>
	)
}

export default Index